<template>
  <div>
    <b-row style="margin-right: 0px;">
      <b-col xl="12" style="margin-top:10px">
        <!-- 模型历史列表-->
        <b-container fluid style="font-size: 0.9rem;">
          <InfoTable ref="InfoTable" :param="param" location="records/search/branch" :fixed="false" href="records">
            <template slot="button-operation">
              <slot name="button-operation">
                <div></div>
              </slot>
            </template>
            <template slot="table-operation" slot-scope="row">
              <slot name="table-operation" :data="row">
                <b-btn variant="outline-primary" style="margin-right:5px;padding:5px;font-size:0.7rem" @click="alter(row)">查看</b-btn>
                <b-btn variant="outline-primary" style="margin-right:5px;padding:5px;font-size:0.7rem" @click="deleteModelModalHandleOpen(row)">删除</b-btn>
              </slot>
            </template>
          </InfoTable>
          <!-- 删除模型操作Modal -->
          <b-modal ref="DeleteModelModal" title="删除模型" size="lg">
            <b-container fluid>
              确定删除?
            </b-container>
            <div slot="modal-footer" class="w-100">
              <b-btn size="sm" class="float-right" variant="primary" @click="$refs.DeleteModelModal.hide()">
                返回
              </b-btn>
              <b-btn size="sm" class="float-right" style="margin-right:10px" variant="primary" @click="remove()">
                确定
              </b-btn>
            </div>
          </b-modal>
        </b-container>
      </b-col>
    </b-row>
  </div>
</template>

<script>
import InfoTable from "@/components/InfoTable";
import InfoModal from "@/components/InfoModal.vue";
import {
  baseURL,
  get,
  save,
  associate,
  getAndAssociate,
  remove,
  axios
} from "@/service/api";
// FaultAnticipateModelHistoryList,就是查看模型的历史，其中可以通过修改按钮重新设置模型的内容
export default {
  components: {
    InfoTable,
    InfoModal
  },
  data() {
    return {
      param: "",
      currentBranch: {
        name: ""
      },
      currentRecord: {},
      currentBranchId: -1
    };
  },
  created() {
    this.currentBranch = JSON.parse(this.$route.query.entry);
    this.currentBranchId = parseInt(
      this.getKey(this.currentBranch._links.self.href)
    );
    this.param = "branchId=" + this.currentBranchId;
  },
  methods: {
    deleteModelModalHandleOpen(row) {
      this.currentRecord = row;
      this.$refs.DeleteModelModal.show();
    },
    alter(row) {
      this.currentDetail = row;
      // 进入修改页面操作
      const { href } = this.$router.resolve({
        path: "/fault-treatment/fault-anticipatie-model-manger",
        query: { entry: JSON.stringify(row.data.item), isMasterBranch: false }
      });
      window.open(href, "_blank");
    },
    getKey(str) {
      let position = str.lastIndexOf("/");
      return str.substring(position + 1, str.length);
    },
    remove: async function() {
      await remove(this.currentRecord.data.item._links.self.href)
        .then(function(response) {
          if (response.status == "204") {
            alert("分支删除成功");
          }
          console.log(response);
        })
        .catch(function(error) {
          console.log(error);
        });
      this.$refs.InfoTable.refresh();
      this.$refs.DeleteModelModal.hide();
    }
  }
};
</script>

<style scoped>
</style>
